<template>
	<view>
		<!--楼栋显示-->
		<liuyuno-tabs :tabData="buildingList" @tabClick="buildClick" />
		<!--楼层显示-->
		<liuyuno-tabs :tabData="floorList" @tabClick="floorClick" />
		
		<!--每层宿舍信息显示-->
		<view class="classAttendanceWrap">
			<view
				class="classAttendence0"
				v-for="(item,index) in floorDorList" :key="index" @click="toAttendanceDetail(item)">
				<view class="classAttendenceFont">
					
					<view v-if="item.grade===2" style="color:#0000FF;font-size: 34rpx;margin-top:0rpx">
						{{item.dormitoryNo}}
					</view>
					<view v-else style="font-size: 34rpx;">{{item.dormitoryNo}}</view>			
				</view>
			</view>
		</view>	
		</view>
	</view>
</template>

<script>
	import dormitoryCheck from "@/api/modules/dormitoryCheck.js"
	import managementTeacher from "@/api/modules/managementTeacher.js"
	import teachClass from "@/api/modules/teachClass.js"
	export default {
		data() {
			return {
				buildingList: [],//楼栋tab
				floorList: [],//楼层tab
				floorDorList: [], //楼层对应宿舍信息
				topName: "违纪提交",
				userName: "",
				buildNo: "",
				storey: "",
				storeyList: [],
				dormitoryNoList: [],
				studentList: [],
				studentNoArray: [],
				dormitoryNo: "",
				biuldList: [{
					value: "畔湖苑",
					text: "畔湖苑",
				}, {
					value: "听湖苑",
					text: "听湖苑",
				}, ],
				isShow: false,
				classDeptName: "",
				checkStatusBtn: false,
			}
		},
		methods: {
			//楼栋点击
			buildClick(index) {
				this.selectedBuildName = this.buildingList[index].name;
				this.selectedBuildNo = this.buildingList[index].id;
				this.getAppDorListByBuildAndFloor();
			},
			//楼层点击
			floorClick(index) {
				this.selectedFloorName = this.floorList[index].name;
				this.selectedFloorNo = this.floorList[index].id;
				this.getAppDorListByBuildAndFloor();
			},
			//根据楼栋和楼层获取宿舍信息
			getAppDorListByBuildAndFloor() {
				this.floorDorList = [];
				this.$api.dormitory.getAppDorListByStorey(this.selectedBuildName, this.selectedFloorName).then(res => {
					this.floorDorList=res.data;
					this.floorDorList.forEach((item, index) => {
						item.grade = "未查"
						item.dormitoryId = item.bdormitoryId
					});
				})
			},
			changeFun(e, item) {
				item.checkBtn = !item.checkBtn
				if (item.checkBtn == false) {
					this.checkStatusBtn = false
				}
				this.$forceUpdate()
			},
			checkBtnCheck() {
				this.checkStatusBtn = !this.checkStatusBtn
				if (this.checkStatusBtn) {
					this.studentList.forEach((item) => {
						item.checkBtn = true
					})
				} else {
					this.studentList.forEach((item) => {
						item.checkBtn = false
					})
				}
				this.$forceUpdate()
			},
			// 去详情页
			toDetail() {
				console.log(this.studentList)
				this.studentNoArray = []
				this.studentList.forEach((item, index) => {
					if (item.checkBtn == true) {
						this.studentNoArray.push(item.studentNo)
					}
				})
				console.log(this.studentNoArray)
				uni.navigateTo({
					url: `/pages_main/managementTeacher/violationsDisciplineCT/violationsDisciplineCT?buildNo=${this.buildNo}&storey=${this.storey}&dormitoryNo=${this.dormitoryNo}&item=${JSON.stringify(this.studentNoArray)}`
				})
			},
			changeBuild() {

			},
			//进入宿舍考勤详情页面
			toAttendanceDetail(item) {
				uni.navigateTo({
					url: `/pages_main/managementTeacher/violationsDisciplineCT/violationsDisciplineCT?dormitoryId=${item.bdormitoryId}`
				})
			},
			// 查询楼栋
			getBuildList() {
				dormitoryCheck.findDormBuilding().then(res => {
					console.log(res)
				})
			},
			// 查询层数
			getStoreyList() {
				dormitoryCheck.findDormStorey().then(res => {
					res.data.forEach(item => {
						let obj = {}
						obj.text = item.dictLabel
						obj.value = item.dictLabel
						this.storeyList.push(obj)
					})
				})
			},
			// 获取宿舍列表
			getDormitoryList() {
				this.dormitoryNoList = []
				dormitoryCheck.getAppDorListByStorey(this.buildNo, this.storey).then(res => {
					console.log(res)
					res.data.forEach(item => {
						let obj = {}
						obj.text = item.dormitoryNo
						obj.value = item.bdormitoryId
						this.dormitoryNoList.push(obj)
					})
				})
			},
			// 选择宿舍号
			changeDormitory() {
				this.studentList = []
				managementTeacher.getStudentByDormitoryId(this.dormitoryNo).then(res => {
					this.studentList = res.data
				})
			},
			// 选择楼层
			changeStorey(e) {
				this.steory = e
				this.getDormitoryList()
			},
			// 数字变中文
			convertToChineseNumeral(num) {
				if (num == 10) {
					return '十'
				} else if (num == 1) {
					return '一'
				}
				const digits = ['零', '一', '二', '三', '四', '五', '六', '七', '八', '九'];
				const units = ['', '十', '百', '千', '万'];
				let result = '';
				let numStr = num.toString();
				for (let i = 0; i < numStr.length; i++) {
					let digit = parseInt(numStr.charAt(i));
					let unit = units[numStr.length - i - 1];
					if (digit === 0) {
						// 当前数字为0时不需要输出汉字，但需要考虑上一个数字是否为0，避免出现连续的零
						if (result.charAt(result.length - 1) !== '零') {
							result += '零';
						}
					} else {
						result += digits[digit] + unit;
					}
				}
				// 对于一些特殊的数字，如10、100等，需要在最前面加上“一”
				if (result.charAt(0) === '一') {
					result = result.substr(1, result.length);
				} else if (result.charAt(0) === '百') {
					result = '一' + result;
				} else if (result.charAt(0) === '千') {
					result = '一' + result;
				}
				return result;
			},
			clearData() {
				this.checkStatusBtn = false
				this.studentList.forEach((item, index) => {
					item.checkBtn = false
				})
				this.$forceUpdate()
			}
		},
		onLoad(options) {
			//获取楼栋和楼层
			teachClass.getDictByType("sys_building").then(res => {
				this.buildingList = [
				  ...res.data.map(item => {  
				    let obj = {};  
					obj.id = item.dictValue;
					obj.name = item.dictLabel;
				    return obj;  
				  })  
				];
				
				if(this.buildingList.length === 0) {
					return;
				}
				
				this.selectedBuildName = this.buildingList[0].name;
				this.selectedBuildNo = this.buildingList[0].id;
				
				teachClass.getDictByType("sys_storey").then(res => {
					this.floorList = [
					  ...res.data.map(item => {  
					    let obj = {};  
						obj.id = item.dictValue;
						obj.name = item.dictLabel;
					    return obj;  
					  })  
					];
					
					if(this.floorList.length === 0 ) {
						return;
					}
					this.selectedFloorName = this.floorList[0].name;
					this.selectedFloorNo = this.floorList[0].id;
					
					//根据楼栋和楼层获取宿舍信息
					this.getAppDorListByBuildAndFloor();
				})
			});
			this.getBuildList()
			this.userName = uni.getStorageSync("userName")
			if (options.flag == 1) {
				this.buildNo = options.buildNo
				this.storey = options.storey
				this.dormitoryNo = Number(options.dormitoryNo)
				this.userName = uni.getStorageSync("userName")
				this.getStoreyList()
				this.getDormitoryList()
				this.changeDormitory()
			} else {
				this.getStoreyList()

			}
		},
		onHide()  {
		    // 页面卸载时触发
		    this.clearData();
		  },
	}
</script>

<style>
	.classAttendanceWrap {
			width: 700rpx;
			margin-top: 15rpx;
			display: flex;
			justify-content: space-around;
			align-content: space-between;
			flex-direction: row;
			flex-wrap: wrap;
			padding-left: 10rpx;
		}
		
		.classAttendence0 {
			width: 23%;
			height: 180rpx;
			background-image: url(https://tj-1305380059.cos.ap-nanjing.myqcloud.com/pic/A.png);
			background-size: 100%;
			background-repeat: no-repeat;
			margin-top: 15rpx;
		}
		
		.classAttendence1 {
			width: 23%;
			height: 180rpx;
			background-image: url(https://tj-1305380059.cos.ap-nanjing.myqcloud.com/pic/b.png);
			background-size: 100%;
			background-repeat: no-repeat;
			margin-top: 15rpx;
		}
		
		.classAttendence3 {
			width: 23%;
			height: 180rpx;
			background-image: url(https://tj-1305380059.cos.ap-nanjing.myqcloud.com/pic/E-1.png);
			background-size: 100%;
			background-repeat: no-repeat;
			margin-top: 15rpx;
		}
		
		.classAttendence2 {
			width: 23%;
			height: 180rpx;
			background-image: url(https://tj-1305380059.cos.ap-nanjing.myqcloud.com/pic/tubiao-012.png);
			background-size: 100%;
			background-repeat: no-repeat;
			margin-top: 15rpx;
		}
		.classAttendenceFont {
			color: white;
			text-align: center;
			margin-top: 60rpx;
		
		}
	
	.cardBorder {
		border-top: 1rpx solid #ddd;
	}

	.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.indexContent {
		height: 100vh;
	}

	.line {
		width: 85%;
		height: 1rpx;
		background-color: #3333d3;
		margin: 20rpx auto 0;

	}

	.card {
		display: flex;
		align-items: center;
		padding: 40rpx 40rpx;
		font-size: 28rpx;
		/* border-top: 1rpx solid #ddd; */
	}

	.miniButton {
		font-size: 32rpx;
		padding: 20rpx 25rpx;
		border-radius: 10rpx;
		color: #fff;
		margin-left: 40rpx;
	}

	.topSty {
		background-color: #0000EE;
		width: 155rpx;
		/* height:190rpx; */
		position: absolute;
		z-index: 9999 !important;
		text-align: center;
		color: #fff;
		right: 2.5%;
		top: 6%;
	}
	
	.bottomView {
		display: flex;
		position: fixed;
		bottom: 0;
		background-color: #0000EE;
		height: 10%;
		width: 100%;
		align-items: center;
		justify-content: space-around;
	}

	.navList {
		color: white;
		width: 150rpx;
		height: 45rpx;
		font-size: 32rpx;
		line-height: 30rpx;
		margin-top: 3rpx;
		/* padding-left:13rpx; */
		padding-top: 5rpx;
	}

	/* 	::v-deep .uni-select__input-text[data-v-6b64008e] {
		font-size: 22rpx;
		width: 100rpx;
	}

	::v-deep .uni-select__selector-item[data-v-6b64008e] {
		font-size: 22rpx;
	} */

	::v-deep .uni-stat__actived[data-v-6b64008e] {
		width: 150rpx;
	}

	::v-deep .uni-select[data-v-6b64008e] {
		width: 150rpx;
	}
</style>